<%--
  Created by IntelliJ IDEA.
  User: 123
  Date: 2022/11/2
  Time: 16:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人中心-我的订单</title>

    <link rel="shortcut icon" href="${pageContext.request.contextPath}/img/jiejie_logo_s.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/head.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/profile_order.css">
    <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.min.js"></script>
</head>
<body>



    <!-- 头部导航 -->
    <div class="header">
        <div class="header-inner">
            <div class="nav">
                <!-- logo -->
                <div class="logo">
                    <a href=""><img src="${pageContext.request.contextPath}/img/jiejie_logo.png" alt=""></a>
                </div>
                <div>
                    <div class="menu-item"><a href="${pageContext.request.contextPath}/index.jsp">首页</a></div>
                    <div class="menu-item"><a href="${pageContext.request.contextPath}/pages/films.jsp">电影</a></div>
                    <div class="menu-item"><a href="${pageContext.request.contextPath}/pages/cinema.jsp">影院</a></div>
                    <div class="menu-item"><a href="${pageContext.request.contextPath}/orderby">榜单</a></div>
                </div>

                <div class="search-form">
                    <input type="text" class="search-text">
                    <a href=""><span class="search-img"></span></a>

                </div>
                <div class="head-user">
                    <a href="pages/login.jsp" class="loginBtn">登录</a>
                    <a href="pages/home_regist.jsp" class="loginBtn">注册</a>
                </div>
                <div class="user-info">
                    <div class="user-avatar has-login">
                        <img src="${pageContext.request.contextPath}/img/touxiang.png">
                        <ul class="user-menu yes-login-menu">
                            <li class="text"><a href="pages/profile_msg.html">我的订单</a></li>
                            <li class="text"><a href="">基本信息</a></li>
                            <li class="text"><a href="">退出登录</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 避免下面的块上移 -->
    <div class="header-m"></div>

    <div class="container">
        <div class="main">
            <!-- 左盒子 -->
            <div class="left-container">
                <h1>个人中心</h1>
                <button class="myorder">我的订单</button>
                <button class="my-msg">我的消息</button>
                <button class="my-coupon">我的优惠券</button>
<%--                <a href="" class="myorder">我的订单</a>--%>
<%--                <a href="" class="my-msg">我的消息</a>--%>
<%--                <a href="" class="my-coupon">我的优惠券</a>--%>
            </div>

            <div class="order">
                <!-- 右盒子 -->
                <div class="right-container">
                    <div class="profile-title-container">
                        <span>我的订单</span>
                    </div>

                    <c:forEach items="${OrderAndSchedule}" var="oas">
                        <div class="order-box">
                            <div class="order-header">
                                <span class="order-date">${oas.key.orderCreatetime}</span>
                                <span class="order-id">杰杰电影订单号：${oas.key.orderNum}</span>
                                <span class="OrderId" hidden="hidden">${oas.key.orderId}</span>
                                <button class="del-order"></button>
                            </div>
                            <div class="order-body">
                                <div class="poster">
                                    <img src="${oas.value.get(1).moviePicture}" alt="" class="moviePicture">
                                </div>
                                <div class="order-content">
                                    <div class="movie-name">${oas.value.get(1).movieCname}</div>
                                    <div class="cinema-name">世纪巨星电影城（步行街店）</div>
                                    <div class="hall-ticket">
                                        <span>${oas.value.get(0).hallName}</span>
                                        <span>${oas.key.orderSeatNum}</span>
                                    </div>
                                    <div class="show-time">${oas.value.get(0).scheduleBeginDate}&nbsp;${oas.value.get(0).scheduleBeginTime}</div>
                                </div>
                                <div class="order-price">￥${oas.key.orderAdjustedPrice}</div>
                                <div class="order-status"> ${oas.key.orderStatus} </div>
                                <div class="actions">
                                    <div>
                                        <a href="MovieDetail?movieId=${oas.value.get(1).movieId}" class="order-detail">点击评价</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                </div>
            </div>

            <div class="message"  style="display:none">
                <div class="right-container">
                    <div class="profile-title-container">
                        <span>我的消息</span>
                    </div>
                    <c:forEach items="${OrderAndMovie}" var="oam">
                        <div class="m-order-box">
                            <div class="m-order-header">
                                <span class="m-order-date">${oam.value.movieOpenhours}</span>
                                <span class="m-order-id">预定的电影上映了！</span>
<%--                                <span class="m-del-order"></span>--%>
                            </div>
                            <div class="m-order-body">
                                <div class="m-poster">
                                    <img src="${oam.value.moviePicture}" alt="" class="m-moviePicture">
                                </div>
                                <div class="m-order-content">
                                    <div class="m-movie-name">${oam.value.movieCname}</div>
                                </div>
                                <div class="m-order-price"> </div>
                                <div class="m-order-status">
                                    <div>
                                        <a href="MovieDetail?movieId=${oam.value.movieId}" class="m-order-detail">查看详情</a>
                                    </div>

                                </div>
                                <div class="m-actions">
                                    <div>
                                        <a href="movieSchedule?movieId=${oam.value.movieId}" class="m-order-detail">立即购票</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </c:forEach>


                </div>
            </div>

            <div class="coupon" style="display: none">
                <div class="right-container">
                    <div class="profile-title-container">
                        <span>我的优惠券</span>
                    </div>

                    <c:forEach items="${CustomerCoupon}" var="cc">
                        <div class="c-order-box">
                            <div class="c-order-header">
                                <span class="c-order-date">${cc.value.customerAndCouponCreateTime}</span>
                                <span class="c-order-id">优惠卷码：${cc.value.orther1}</span>
<%--                                <span class="c-del-order"></span>--%>
                            </div>
                            <div class="c-order-body">
                                <div class="c-poster">
                                    <img src="${cc.key.couponPicture}" alt="">
                                </div>
                                <div class="c-order-content">
                                    <div class="c-movie-name"></div>
                                    <div class="c-cinema-name"></div>
                                    <div class="c-hall-ticket">
                                        <span></span>
                                        <span></span>
                                    </div>
                                    <div class="c-show-time"></div>
                                </div>
                                <div class="c-order-price">优惠金额：￥${cc.key.couponAmount}</div>
                                <div class="c-order-status"> ${cc.value.customerAndCouponStatus} </div>
                                <div class="c-actions">
                                    <div>
                                        <a href="${pageContext.request.contextPath}/index.jsp" class="c-order-detail">点击使用</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                </div>

            </div>

        </div>
    </div>
<script src="${pageContext.request.contextPath}/js/profile_order.js"></script>
</body>
</html>
